import {
  Component
} from 'react';

import {

} from 'saltui';

import './Field.less';
import Loading from '../loading';

export default class AttachmentShow extends Component {

  constructor(props) {
    super(props);
    this.state = {

    }
  }

  calculate = function(no) {
    let a = no / 1024;
    if (a < 1) {
      return no + 'B';
    }
    let b = a / 1024;
    if (b < 1) {
      return Math.round(a * 100) / 100 + 'KB';
    }
    return Math.round(b * 100) / 100 + 'MB';
  }

  handleShowFile(file) {
    allowupload(function(result) {
      let name = file.fileDisplayName;
      let type = name.substring(name.lastIndexOf('\.') + 1, name.length);
      dd.biz.cspace.preview({
        corpId: corpid,
        spaceId: file.dingSpaceId,
        fileId: file.dingFileId,
        fileName: file.fileDisplayName,
        fileSize: file.fileSize,
        fileType: type,
        onSuccess: function() {
          //无，直接在弹窗页面显示文件详细信息
        },
        onFail: function(err) {}
      });
    });
  }

  render() {
    let html;
    if (this.props.attachment && this.props.attachment instanceof Array && this.props.attachment.length > 0) {
      html = this.props.attachment.map((item, index) => {
        return (
          <div key={item.dingFileId} className="dd-t-border t-P6 t-MB10 t-FBH" data-key={item.dingSpaceId}
                       onClick={this.handleShowFile.bind(this, item)}>
                      <i className="iconfont icon-file t-FCc t-FL t-MR6"></i>
                      <div className="dd-t-list-text-content">
                          <div className="t-list-title t-LH1_4">
                              {item.fileDisplayName}
                          </div>
                          <div className="dd-t-list-time t-FBAC">{this.calculate(item.fileSize)}</div>
                      </div>
                  </div>
        )
      });
    }
    return (
      <div className="t-group-list ">
                <div className="t-field-box t-FBH t-FBAC t-FBJ">
                    <div className="t-field-layout-h-label t-FS16">附件</div>
                </div>

                <div className="t-field-box  dd-upload-file">
                    {html}
                </div>
            </div>
    );
  }

}